App-solutely Fabulous: A Data Scientist’s Guide to Choosing Python Web Tools Wisely

Who am I?

Data Scientists in R love Shiny

Python has many more options

Too many options

Try (some of) them!

Server vs. Serverless

• The computations need to happen somewhere - Python or R needs to be installed somewhere
  • Setting up servers can be difficult
• localhost:8000 - doesn’t help with sharing
• In-browser versions can be helpful
  • BE CAREFUL ABOUT YOUR PASSWORDS AND API KEYS

Streamlit

Streamlit - 😃

• Lots of elements to use
  • New ones all the time
• Very Pythonic
  • Simple to transition from script

Streamlit - 🫤

• Runs top to bottom - not at all reactive
  • Has caching, but it gets confusing very quickly
• Can get very slow if it gets big
• All Streamlit apps kinda look the same
  • Hard to tweak UI

Streamlit

Streamlit-Lite

• Stlite

  • Not officially supported by Streamlit

• Pretty easy interface to copy your Streamlit apps

• I couldn’t figure out how to do streaming

• Slower to load, slower to run

• Link: In-Browser Streamlit

Gradio

Gradio - 😃

• Very focused on ML
• Even simpler than Streamlit
• Built in interfaces for Chat
  • Easy to add in features like chat history, Thumbs Up/ Thumbs Down
• Has reactive blocks
• Can turn it into an API

Gradio - 🫤

• Less flexible than Streamlit
  • Complicated to do multiple things at once
• Fewer components available
  • Sometimes need to use HTML to do what you want
• All Gradio apps look the same – even more so than Streamlit

Gradio - Simplest

Gradio - More Complex

Gradio - Deployment Possibilities

• Local / Self-hosted
• Public Link, local compute (share=True)
• Through Huggingface Spaces (free with basic CPU)
• In-browser (Gradio Lite)
  • I couldn’t figure it out

Shiny

• 2012: Developed for R by the company formerly known as RStudio
• 2022:
  

Two Types of Shiny

Shiny - 😃

• All Shiny is reactive - great for complex Apps
• Lots of components
• Documentation gives really good background/philosophy on how it works
• Very flexible, can make almost any change you want

Shiny - 🫤

• I found it confusing, not as intuitive/“Pythonic”
• Default UI is pretty bland
• Not as many components as Streamlit
• You kinda need to learn the philosophy of Shiny before you can do much complicated

Shiny Example

Shiny is building in Chat Components

Help is on the way!

Shinylive

Shinylive really is easy!

One other option…

If you’re going to go in-browser, and what you’re doing isn’t that complex…

… ChatGPT might be able to build it for you

Ask ChatGPT to build you an in-browser tool

It will then improve it nicely

So What Should I Do?

• If you know one system well, you can probably stay inside it - they can mostly do the same things

Really, What Should I Do?

%%{init: {'theme': 'default', 'themeVariables': { 'fontSize': '20px', 'fontFamily': 'arial', 'nodeTextColor': '#000000', 'mainBkg': '#f5f5f5' }}}%%
flowchart LR
    A[Start] --> B{Running a simple<br>AI model?}
    B -->|Yes| C[Use Gradio]
    B -->|No| F{Need complex app with<br>lots of interactive changes?}
    F -->|Yes| E[Use Shiny]
    F -->|No| H[Use Streamlit]

    style C fill:#90EE90,color:#000000,font-weight:bold
    style E fill:#90EE90,color:#000000,font-weight:bold
    style H fill:#90EE90,color:#000000,font-weight:bold
    style B fill:#f5f5f5,color:#000000,font-weight:bold
    style F fill:#f5f5f5,color:#000000,font-weight:bold
    style A fill:#f5f5f5,color:#000000,font-weight:bold

But …

%%{init: {'theme': 'default', 'themeVariables': { 'fontSize': '16px', 'fontFamily': 'arial', 'nodeTextColor': '#000000', 'mainBkg': '#f5f5f5' }}}%%
flowchart LR

    A([Start])
    X{Is this a one-off app that<br>can be done in-browser and<br>doesn't need heavy Python?}
    Y[Just ask an LLM<br>to make it for you]
    
    A --> X
    X -->|Yes| Y
    X -->|No| B
    subgraph Python-Frameworks[" "]
        direction LR
        B{Running a simple<br>AI model?}
        B -->|Yes| C[Use Gradio]
        B -->|No| F{Need complex app with<br>lots of interactive changes?}
        F -->|Yes| E[Use Shiny]
        F -->|No| H[Use Streamlit]
    end

    style C fill:#90EE90,color:#000000,font-weight:bold
    style H fill:#90EE90,color:#000000,font-weight:bold
    style E fill:#90EE90,color:#000000,font-weight:bold
    style Y fill:#90EE90,color:#000000,font-weight:bold,font-size:22px,stroke:#000000,stroke-width:3px,width:350px,height:100px
    style B fill:#f5f5f5,color:#000000,font-weight:bold
    style F fill:#f5f5f5,color:#000000,font-weight:bold
    style A fill:#f5f5f5,color:#000000,font-weight:bold,fontSize:20px
    style X fill:#f5f5f5,color:#000000,font-weight:bold
    
    style Python-Frameworks fill:#e0e0e0,stroke-dasharray: 5 5